<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>setInterval Modification Test</title>
</head>

<body>
    <h1>setInterval Modification Test</h1>
    <div>
        <button onclick="clearOutput()">清空输出</button>
    </div>
    <div>
        <input type="number" id="inputSetIntervalTime" value="1000" />
        <button onclick="TEST.testSetIntervalTimer()">setInterval</button>
        <button onclick="TEST.stopSetIntervalTimer()">stop</button>
    </div>
    <div>
        <input type="number" id="inputSetTimeoutTime" value="1000" />
        <button onclick="TEST.testSetTimeoutTimer()">setTimeout</button>
        <button onclick="TEST.stopSetTimeoutTimer()">stop</button>
    </div>
    <div>
        <input type="text" id="inputCookieName" value="white" />
        <button onclick="TEST.testSetCookie()">setCookie</button>
        <button onclick="TEST.stopClearCookie()">clearCookie</button>
    </div>
    <div>
        <button onclick="TEST.testAlert()">alert</button>
        <button onclick="TEST.testHistoryBack()">history back</button>
    </div>
    <div id="output" style="height: 500px;overflow: auto;border: 2px solid black"></div>

    <script>
        const ids = {
            setInterval: 0,
            setTimeout: 0,
        }

        function setCookie(name, value, days) {
            let expires = "";
            if (days) {
                const date = new Date();
                date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
                expires = "; expires=" + date.toUTCString();
            }
            const cookie = name + "=" + (value || "") + expires + "; path=/";
            document.cookie = cookie
            return cookie
        }

        function clearAllCookiesWithPathAndDomain() {
            // 获取当前域名
            const domain = window.location.hostname;

            // 获取当前路径
            const path = window.location.pathname;

            // 先尝试删除根路径下的Cookie
            clearCookiesByPathAndDomain('/', domain);

            // 再尝试删除当前路径下的Cookie
            clearCookiesByPathAndDomain(path, domain);
        }

        function clearCookiesByPathAndDomain(path, domain) {
            const cookies = document.cookie.split('; ');
            for (const cookie of cookies) {
                const name = cookie.split('=')[0];
                document.cookie = name + '=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=' + path + '; domain=' + domain + ';';
            }
        }

        const TEST = {
            testSetIntervalTimer: function () {
                let testTime = parseInt(document.getElementById('inputSetIntervalTime').value)
                testTime = testTime && testTime !== NaN ? testTime : 3000
                ids.setInterval = setInterval(() => {
                    document.getElementById('output').innerHTML += `<p>setInterval(${testTime}ms)</p>`;
                }, testTime);
            },
            stopSetIntervalTimer: function () {
                clearInterval(ids.setInterval)
            },
            testSetTimeoutTimer: function () {
                let testTime = parseInt(document.getElementById('inputSetTimeoutTime').value)
                testTime = testTime && testTime !== NaN ? testTime : 3000
                ids.setTimeout = setTimeout(() => {
                    document.getElementById('output').innerHTML += `<p>setTimeout(${testTime}ms)</p>`;
                }, testTime);
            },
            stopSetTimeoutTimer: function () {
                clearTimeout(ids.setTimeout)
            },
            testSetCookie: function () {
                let cookieName = document.getElementById('inputCookieName').value
                document.getElementById('output').innerHTML += setCookie(cookieName, "white666", 7);
            },
            stopClearCookie: function () {
                clearAllCookiesWithPathAndDomain()
            },
            testAlert: function () {
                window.alert("test alert")
            },
            testHistoryBack: function () {
                window.history.back()
            },
        }

        function clearOutput() {
            document.getElementById('output').innerHTML = "";
        }
    </script>
</body>

</html>